<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>script.aculo.us sidebar</title>

<script type="text/javascript">
	<jsp:include page="/WEB-INF/js/prototype.js" />
</script>
<script type="text/javascript">
	<jsp:include page="/WEB-INF/js/effects.js" />
</script>
<script type="text/javascript">
	<jsp:include page="/WEB-INF/js/side-bar.js" />
</script>

<style>


/****************************************/

a{
	outline: none;
}

a:active{
	outline: none;
}

#sideBar{
text-align:left;
}

#sideBar h2{
	color:#FFFFFF;
	font-size:110%;
	font-family:arial;
	margin:10px 10px 10px 10px;
	font-weight:bold;
	
}

#sideBar h2 span{
	font-size:125%;
	font-weight:normal;
	
}

#sideBar ul{
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
}

#sideBar li{
	margin:0px 10px 3px 10px;
	padding:2px;
	text-align:left;
	list-style-type:none;
	display:block;
	width:130px;
	color:#FFFFFF;
}

#sideBar li a{
	width:100%;
}

#sideBar li a:link,
#sideBar li a:visited{
	color:#FFFFFF;
	font-family:verdana;
	font-size:100%;
	text-decoration:none;
	display:block;
	margin:0px 0px 0px 0px;
	padding:0px;
	width:100%;
}

#sideBar li a:hover{
	color:#FFFFFF;
	font-style:bold;
	text-decoration:underline;
}

#sideBar{
	position: absolute;
	width: auto;
	height: auto;
	top: 140px;
	left:0px;
	background-image:url(/WEB-INF/images/background.gif);
	background-position:top left;
	background-repeat:repeat-y;
}

#sideBarTab{
	float:left;
	height:137px;
	width:28px;
	
}

#sideBarTab img{
	
	border-style:solid;
	border-width:1px;
	border-color:black;
}

#sideBarContents{
	border-style:outset;
	border-width:1px;
	border-color:black;
	float:left;
	overflow:hidden !important;
	width:150px;
	height:137px;
	background-image:url(/WEB-INF/images/backmenu.gif);
}

#sideBarContentsInner{
	width:100px;
}
</style>

</head>

<body>

<div id="sideBar">
	
	<a href="#" id="sideBarTab"><img src="/WEB-INF/images/slide-button.gif" alt="sideBar" title="sideBar" /></a>
	
	<div id="sideBarContents" style="display:none;">
		<div id="sideBarContentsInner">
			<h2></h2>
			
			<ul>

				<li><a href="http://www.google.com">Link On</a></li>
				<li><a href="http://www.google.com">Link Two</a></li>
				<li><a href="http://www.google.com">Link Three</a></li>
				
				
			</ul>

			
		</div>
	</div>
	
</div>

</body>
</html>